<template>
  <div>
    <el-dialog
      v-el-drag-dialog
      title="结转明细"
      :visible.sync="visible"
      width="80vw"
      :append-to-body="true"
      @closed="reset"
    >
      <div class="page">
        <lb-table
          ref="lbTable"
          v-loading="$loadingPlugin.fetchData"
          border
          height="440px"
          max-height="440px"
          element-loading-text="加载中"
          :column="tableData.column"
          :data="tableData.data"
          :total="tableData.total"
          custom-column
          :immediate-fetch="false"
          @fetch="fetchData"
        />
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import { invenCarryQueryByDate } from '@/api'
  import { formatColumnMap, parseTime } from '@/utils'
  //   import { mapGetters } from 'vuex'
  //   import { mergeAsyncFunc } from '@/utils/mergeAsyncFunc'

  export default {
    components: {

    },
    props: {
      gdStatusMap: {
        type: Array,
        default: []
      }
    },
    data() {
      return {
        visible: false,
        temp: {},
        tableData: {
          data: [],
          total: 0,
          column: [
            {
              type: 'index'
            },
            {
              prop: 'specName',
              label: '规格型号',
              align: 'center'
            },
            {
              prop: 'gdStatus',
              label: '状态',
              render: (h, { row }) => <span>{row.gdStatus ? formatColumnMap(this.gdStatusMap, 'value', row.gdStatus, 'desc') : ''}</span>
            },
            {
              prop: 'carryCount',
              label: '期初库存',
              width: 105
              // render: (h, { row }) => <el-link underline={false} onClick={() => this.openCsmDetail(row)}>{row.csmCode}</el-link>
            },
            {
              prop: 'inCount',
              label: '本期入库',
              align: 'center',
              children: [
                {
                  prop: 'count1',
                  label: '调拨'
                },
                {
                  prop: 'count2',
                  label: '入库单'
                },
                {
                  prop: 'count3',
                  label: '配送员还瓶'
                },
                {
                  prop: 'count4',
                  label: '退货'
                },
                {
                  prop: 'count5',
                  label: '退瓶消单'
                }
              ]
            },
            {
              prop: 'outCount',
              label: '本期出库',
              align: 'center',
              children: [
                {
                  prop: 'count6',
                  label: '调拨'
                },
                {
                  prop: 'count7',
                  label: '出库单'
                },
                {
                  prop: 'count8',
                  label: '配送员领瓶'
                },
                {
                  prop: 'count9',
                  label: '退货'
                }
              ]
            },
            {
              prop: 'count10',
              label: '盘盈/亏',
              render: (h, { row }) => (<span style={row.count10 > 0 ? 'color:red;' : row.count10 < 0 ? 'color:green' : ''}>{row.count10}</span>)
            },
            {
              prop: 'csmRgPhone',
              label: '期末库存',
              render: (h, { row }) => (<span >{row.carryCount + (row.count1 + row.count2 + row.count3 + row.count4 + row.count5) - (row.count6 + row.count7 + row.count8 + row.count9) + row.count10}</span>)
            }
          ]
        }
      }
    },
    computed: {
    },
    watch: {

    },
    mounted() {

    },
    destroyed() {

    },
    methods: {
      open(temp) {
        return new Promise(resolve => {
          this.resolve = resolve
          this.visible = true
          if (temp) {
            this.temp = temp
            this.fetchData({ currentPage: 1, pageSize: 20 })
          }
        })
      },
      async fetchData({ currentPage, pageSize }) {
        const query = {
          storeId: this.temp.storeId,
          happendDt: parseTime(this.temp.happendTime, '{y}-{m}-{d} {h}:{i}:{s}')
        }
        const res = await invenCarryQueryByDate(query)
        this.tableData.data = res.data
        // console.log(this.tableData.data)
      },
      reset() {

      }
    }
  }
</script>

<style lang='scss' scoped>

</style>
